import React, { memo } from 'react'
import { StyleSheet, View, TouchableOpacity } from 'react-native'

import { Icon, List, ListItem, Button } from '@ui-kitten/components';

export default (props) => {
    const { data, txtRight, onPress } = props

    // renderItem = ({ item }) => {
    //     return (
    //         <TouchableOpacity onPress={() => onPress(item)}>
    //             <View style={styles.item}>
    //                 <Text style={styles.title}>{item.id}</Text>
    //                 <Text style={styles.desc}>{item.localName || item.name}</Text>
    //             </View>
    //         </TouchableOpacity>
    //     )
    // }

    const renderItemAccessory = (props) => {
        return (<Button size='tiny' onPress={() => onPress(item)
        }>
            连接
        </Button >
        )
    }

    renderItem = ({ item, index }) => (
        <ListItem
            title={`${item.localName || item.name} `}
            description={`${item.connecting ? '连接中' : ''}`}
            accessoryRight={() => <Button size='tiny' disabled={item.connecting} onPress={() => onPress(item)}> {txtRight} </Button >}
        />
    )

    return (
        <List
            style={styles.list}
            data={data}
            renderItem={renderItem}
        />
        // <FlatList
        //     style={styles.list}
        //     ListEmptyComponent={() => <Text style={styles.placeholder}>暂无数据</Text>}
        //     data={data}
        //     ItemSeparatorComponent={() => <View style={styles.border} />}
        //     keyExtractor={(item, index) => '' + index}
        //     renderItem={renderItem}
        // />
    )
}

const styles = StyleSheet.create({
    list: {
        paddingTop: 15
    },
    item: {
        paddingLeft: 16,
        paddingVertical: 8
    },
    title: {
        fontSize: 16
    },
    desc: {
        color: '#666'
    },
    border: {
        backgroundColor: '#d9d9d9',
        height: 0.5
    },
    placeholder: {
        fontSize: 16,
        paddingLeft: 15,
        color: '#666'
    }
})